<template>
	<view>
		<dev-navbar isPageStack @information="information" :bg-color="bgColor">
			<!-- 特殊背景自定义 -->
			<template slot="bottom">
				<view class="custom-background"></view>
			</template>
		</dev-navbar>

		<view class="integral-box" v-if="evaluationInformation">
			<view class="white-box" :style="{'margin-top':`${navAllHeight+30}px`}">
				<view class="evaluation-title">
					{{evaluationInformation.topicName}}
				</view>
				<view class="estimated-time">
					预估{{evaluationInformation.askTime}}分钟
				</view>
				<view class="type-title">
					评估简介
				</view>
				<view class="type-content">
					{{evaluationInformation.topicDesc}}
				</view>
				<view class="type-title">
					评估依据
				</view>
				<view class="type-content" v-html="evaluationInformation.topicBasis">
					<!-- {{evaluationInformation.topicBasis}} -->
				</view>
				<view style="display: flex;justify-content: center;">
					<!-- <dev-button width="280" height="80" radius="45" top="38" left="32" bgColor="#81C042;" fontSize="34">
						邀请朋友测一测
					</dev-button> -->
					<button size="14" type="primary" open-type="share" style="padding: 0 20rpx; width: 350rpx;height: 80rpx;border-radius: 45rpx;margin-top: 38rpx;margin-left: 10rpx;background:#81C042;font-size: 32rpx;text-align: center;padding: 0;border: none !important;background-size: 100% 100%;">邀请朋友测一测</button>
					<!-- <dev-button @tapDev="startAssessment" width="280" height="80" radius="45" top="38" left="26" right="32" bgColor="#F5A623" fontSize="32">
						开始评估
					</dev-button> -->
					<button @click="startAssessment" size="14" type="primary" style="width: 350rpx;height: 80rpx;border-radius: 45rpx;margin-top: 38rpx;margin-left: 26rpx;margin-right: 20rpx; background:#F5A623;font-size: 32rpx;text-align: center;padding: 0;border: none !important;background-size: 100% 100%;">开始评估</button>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				navAllHeight: global.navAllHeight,
				evaluationInformation: '', //评估信息
				topicId:6, //问卷类型id
				topicName:'',
				storeId:'',//门店id
			};
		},
		onLoad(e) {
			// 分享
			wx.showShareMenu({
				withShareTicket: true,
				//设置下方的Menus菜单，才能够让发送给朋友与分享到朋友圈两个按钮可以点击
				menus: ["shareAppMessage", "shareTimeline"]
			})
			console.log(e,'传递过来的参数')
			if(e.topicId){
				this.topicId = e.topicId;
				this.topicName = e.topicName;
			}
			if(e.scene){
				let scene = decodeURIComponent(e.scene);
				let splitParameters =scene.split(',');
				this.storeId = splitParameters[0]
				this.topicId = splitParameters[1]
				console.log(scene,'解析后传递过来的参数')
			}
			//如果当前用户已经登录了 跳转这个界面
			if(global.token){
				this.questionnaireDetails(); //获取评估信息
			}else{
				this.$urouter.redirectTo({
					url: '/pages/signIn/signIn',
					params: {
						jumpInterface:'/pagesHome/start-assessment/start-assessment',
						transferParameters:JSON.stringify(e)
					}
				});
			}
		},
		methods: {
			//发送给朋友
			onShareAppMessage(res) {
				return {
					title: this.topicName,
					type: 0,
					path: 'pagesHome/start-assessment/start-assessment?topicId='+this.topicId,
					summary: "",
					imageUrl: "https://static.bsyjk.cn/bsy-customer/89E202ACF39F43A19951091F6ABF98B0.jpeg"
				}
			},
			//开始评估
			startAssessment() {
				this.$urouter.navigateTo({
					url: '/pagesHome/start-assessment/evaluation-interface',
					params: {
						topicId: this.topicId,
						title: this.evaluationInformation.topicName,
                        storeId:this.storeId
					}
				});
			},

			//获取navAllHeight 信息
			information(e) {
				this.navAllHeight = e.navAllHeight;
			},
			//获取评估信息
			questionnaireDetails() {
				this.$https.get(global.apiUrls.questionnaireDetails, {
					topicId: this.topicId
				}).then(res => {
					if (res.data.code == 1000) {
						this.evaluationInformation = res.data.result;
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.integral-box {
		width: 750rpx;
		min-height: 100vh;
		background-image: url('http://static.bsyjk.cn/shoppingMall/4BA4EC14F13949E79F26AE5BAFAF3226.png');
		background-size: 100% 100%;
		padding: 1rpx 46rpx;

		.white-box {
			width: 658rpx;
			background-color: #fff;
			border-radius: 50rpx;
			padding: 42rpx 50rpx;

			.evaluation-title {
				font-size: 48rpx;
				font-weight: 600;
				color: #000000;
			}

			.estimated-time {
				margin-top: 20rpx;
				font-size: 24rpx;
				font-weight: 400;
				color: #F5A623;
			}

			.type-title {
				margin-top: 38rpx;
				font-size: 26rpx;
				font-weight: 500;
				color: #000000;
			}

			.type-content {
				margin-top: 10rpx;
				font-size: 26rpx;
				font-weight: 400;
				color: #000000;
				line-height: 37rpx;
			}

		}

	}
</style>
